<template>
  <div> 
    <mt-header fixed title="无敌大魔王">
      <mt-button icon="back" @click='$router.back(-1)' slot="left"></mt-button> 
    </mt-header>
    <div style="height: 40px;"></div>
    <div v-show="!loading">
      <div class="my-field" style="margin-top: 0;">
        <div class="my-field-img">
          <img src="@/assets/img/head/male-2.png" />
          无敌大魔王
        </div>
      </div>
      <div class="my-field">
        <div class="my-field-item">
          <span class="my-field-item-l gray6">会员ID</span>
          <router-link class="my-field-item-r" to="">10086</router-link> 
        </div>
        <div class="my-field-item">
          <span class="my-field-item-l gray6">性别</span>
          <router-link class="my-field-item-r" to="">男</router-link>
        </div>
        <div class="my-field-item">
          <span class="my-field-item-l gray6">等级</span>
          <router-link class="my-field-item-r" to="">平民</router-link>
        </div>
        <div class="my-field-item">
          <span class="my-field-item-l gray6">积分</span>
          <router-link class="my-field-item-r" to="">500</router-link>
        </div>
        <div class="my-field-item">
          <span class="my-field-item-l gray6">排名</span>
          <router-link class="my-field-item-r" to="">55</router-link>
        </div>
        <div class="my-field-item">
          <span class="my-field-item-l gray6">擅长项目</span>
          <router-link class="my-field-item-r" to="">男单</router-link>
        </div>
      </div>
      <div class="my-field">
        <!-- <div class="my-field-item">
          <span class="my-field-item-l gray6">TA的搭档</span>
          <router-link class="my-field-item-r" to="">3位</router-link>
          <i class="fa fa-angle-right"></i>
        </div> -->
        <div class="my-field-item">
          <span class="my-field-item-l gray6">TA的俱乐部</span>
          <router-link class="my-field-item-r" to="/my/club">7家</router-link>
          <i class="fa fa-angle-right"></i>
        </div>
        <div class="my-field-item">
          <span class="my-field-item-l gray6">TA的比赛</span>
          <router-link class="my-field-item-r" to="/my/match">23场</router-link>        
          <i class="fa fa-angle-right"></i>  
        </div>
      </div>
      <div style="display:flex; margin:10px; "> 
        <mt-button style="flex:1.5; white-space:nowrap;" @click="inviteClub" type="danger">邀请加入俱乐部</mt-button>
      </div>
    </div>
    <div v-show="loading" class="loading-center" ref="loadBox"><mt-spinner :type="3" color="#999" :size="20"></mt-spinner>加载中…</div>
  </div>
</template>

<script>
export default { 
  data () {
    return {
      loading:false,
      memberId:this.$route.params.id,
    }
  },
  mounted: function (){
    this.$refs.loadBox.style.height = document.documentElement.clientHeight - 40 + "px";
  },
  methods:{
    addMember(){
      this.$messagebox.confirm('<i style="color:#000;">您确定加TA为搭档吗？</i>',null).then(action => {
        if(action == 'confirm'){
          this.$toast('申请加为搭档成功，请等待审核！');
        }
      });
    },
    inviteClub(){
      this.$messagebox.confirm('<i style="color:#000;">您确定邀请TA加入您的俱乐部？</i>',null).then(action => {
        if(action == 'confirm'){
          this.$toast('邀请TA加入您的俱乐部成功,请等待审核！');
        }
      });
    }
  }
}
</script>
